/*
 * @Description:
 * @Author: fhw
 * @Date: 2023-01-30 21:54:07
 */
import { FormFollow } from '@/components'
import { User } from '@/interface'
import { defineComponent, PropType, ref, watch } from 'vue'
import { MenuItem } from '../interface'
import UserInfo from '../userInfo'
interface Axis {
	x: number
	y: number
}

const props = {
	visible: Boolean as PropType<boolean>,
	loading: {
		type: Boolean as PropType<boolean>,
		default: false,
	},
	axis: {
		type: Object as PropType<Axis>,
	},
	userInfo: {
		type: Object as PropType<User>,
		required: true,
	},
	menu: {
		type: Array as PropType<Array<MenuItem>>,
		default: [],
	},
	/** 是否显示备注 */
	showRemarks: {
		type: Boolean as PropType<boolean>,
		default: true,
	},
	/** 显示更多 */
	showMore: {
		type: Boolean as PropType<boolean>,
		default: true,
	},
} as const
export default defineComponent({
	props,
	emits: ['cancel', 'update:visible'],
	setup(props, { emit }) {
		const visible = ref(false)
		watch(
			() => props.visible,
			() => {
				if (props.visible) {
					visible.value = props.visible
				}
			}
		)
		return () => (
			<FormFollow
				v-model={[visible.value, 'visible']}
				loading={props.loading}
				axis={props.axis}
				onCancel={() => {
					emit('cancel')
					emit('update:visible', false)
				}}
			>
				<UserInfo
					dataSource={props.userInfo}
					showRemarks={props.showRemarks}
					showMore={props.showMore}
					menu={props.menu}
					v-model={[props.loading, 'loading']}
				/>
			</FormFollow>
		)
	},
})
